<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
    <meta name="renderer" content="webkit">
    <meta name="viewport" content="width=device-width"/>
    <meta name="author" content=""/>
    <meta name="robots" content="all"/>
    <title>归档</title>
    <link rel="stylesheet" th:href="@{/font-awesome/css/font-awesome.min.css}">
    <link rel="stylesheet" th:href="@{/layui/css/layui.css}"/>
    <link rel="stylesheet" th:href="@{/css/master.css}"/>
    <link rel="stylesheet" th:href="@{/css/gloable.css}"/>
    <link rel="stylesheet" th:href="@{/css/nprogress.css}"/>
    <link rel="stylesheet" th:href="@{/layui/css/modules/layui-icon-extend/iconfont.css}">
    <link rel="stylesheet" th:href="@{/css/timeline.css}">
    <link rel="stylesheet" th:href="@{/css/animate.min.css}">

    <script>
        var _hmt = _hmt || [];
        (function () {
            var hm = document.createElement("script");
            hm.src = "https://hm.baidu.com/hm.js?db61211eab38025ea7cb1aa72611175a";
            var s = document.getElementsByTagName("script")[0];
            s.parentNode.insertBefore(hm, s);
        })();
    </script>
</head>
<body>
<div class="header">
</div>
<header class="gird-header">
    <div class="header-fixed">
        <div class="header-inner">
            <a href="javascript:void(0)" class="header-logo" id="logo">M_secret</a>
            <nav class="nav" id="nav">
                <ul>
                    <li><a th:href="@{/}">博客</a></li>
                    <li><a th:href="@{/categories}">分类</a></li>
                    <li><a th:href="@{/tags}">标签</a></li>
                    <li><a th:href="@{/archive}">归档</a></li>
                    <li><a th:href="@{/me}">我</a></li>
                </ul>
            </nav>
            <a th:href="@{/admin/index}" target="_blank" class="blog-user" style="font-size: 20px">
                m&nbsp&nbsp&nbsp
            </a>
            <a class="phone-menu">
                <i></i>
                <i></i>
                <i></i>
            </a>
        </div>
    </div>
</header>


<div class="doc-container" id="doc-container">
    <div class="container-fixed">
        <div class="timeline-box shadow">
            <div class="timeline-main" style="margin-left: 10%;">
                <h1><i class="fa fa-clock-o"></i>拾年</h1>
                <div class="timeline-line"></div>
                <div class="timeline-year" th:each="archive: ${archives}">
                    <h2  style="font-size: 18px;"><a class="yearToggle">[[${archive.year}]]年([[${archive.total}]])</a><i class="fa fa-caret-down fa-fw"></i></h2>
                    <div class="timeline-month">
                        <ul>
                            <li th:each="article: ${archive.articles}">
                                <div class="h4 animated fadeInLeft">
                                    <p class="date">[[${#dates.month(article.publishTime)}]]月[[${#dates.day(article.publishTime)}]]日</p>
                                </div>
                                <p class="dot-circle animated "><i class="fa fa-dot-circle-o"></i>
                                </p>
                                <div class="content animated fadeInRight" style="margin-bottom: 10px" ><a style="color: #484348;font-size: 18px" th:href="@{/blog/__${article.articleId}__}" target="_blank">
                                    [[${article.articleTitle}]]</a></div>
                                <div class="clear"></div>
                            </li>
                        </ul>
                    </div>
                </div>
                <h1 style="padding-top:4px;padding-bottom:2px;margin-top:40px;"><i
                        class="fa fa-hourglass-end"></i>THE END</h1>
            </div>
        </div>
    </div>
</div>


<footer class="grid-footer" style="text-align: center">
    <div style="width: auto;height: 40px;">
        <div>
            <a href="https://github.com/m-secret" target="_blank">
                　　<i class="iconfont icon-github"></i>
            </a>
            <a href="https://gitee.com/Zhu_Xinyu" target="_blank">
                　　<i class="iconfont icon-gitee"></i>
            </a>
            <a href="https://mail.qq.com/cgi-bin/qm_share?t=qm_mailme&email=2576107424@qq.com"
               title="2576107424@qq.com" target="_blank">
                　　<i class="iconfont icon-qq"></i>
            </a>

        </div>
    </div>
    <p class="mt05">
        Copyright &copy; 2019 M_secret All Rights Reserved
    </p>
</footer>
<script th:src="@{/layui/layui.js}"></script>
<script th:src="@{/js/yss/gloable.js}"></script>
<script th:src="@{/js/plugins/nprogress.js}"></script>
<script th:src="@{/js/timeline.js}"></script>
<script>NProgress.start();</script>
<script th:src="@{/js/yss/article.js}"></script>
<script>
    window.onload = function () {
        NProgress.done();
    };
    (function () {
        var bp = document.createElement('script');
        var curProtocol = window.location.protocol.split(':')[0];
        if (curProtocol === 'https') {
            bp.src = 'https://zz.bdstatic.com/linksubmit/push.js';
        }
        else {
            bp.src = 'http://push.zhanzhang.baidu.com/push.js';
        }
        var s = document.getElementsByTagName("script")[0];
        s.parentNode.insertBefore(bp, s);
    })();
</script>

</body>
</html>
